// 响应式设计
@media (max-width: 768px) {
    .permission-container {
        padding: 16px;
    }

    .permission-stats {
        grid-template-columns: 1fr;
    }

    .permission-toolbar {
        flex-direction: column;
        gap: 16px;
        align-items: stretch;

        &__left,
        &__right {
            justify-content: center;
        }
    }
}

// 动画效果
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.permission-container {
    animation: fadeIn 0.3s ease-out;
}
// 权限管理页面容器
.permission-container {
    transition: background-color 0.3s ease;

    // 内容区域
    &__content {
        background: var(--permission-bg-primary);
        border-radius: 8px;
        box-shadow: var(--permission-shadow-light);
        border: 1px solid var(--permission-border-secondary);
        overflow: hidden;
        transition: all 0.3s ease;
    }
}

// 滚动条样式
.permission-container {
    &::-webkit-scrollbar {
        width: 8px;
        height: 8px;
    }

    &::-webkit-scrollbar-track {
        background: var(--permission-bg-tertiary);
    }

    &::-webkit-scrollbar-thumb {
        background: var(--permission-border-primary);
        border-radius: 4px;

        &:hover {
            background: var(--permission-text-secondary);
        }
    }
}
